<template>
  <div style="margin-top: 30px">
    <el-row>
      <el-col :sm="{span:9,offset:2}">
        <div class="infoFont1">糟糕</div>
        <div class="infoFont2" style="margin-top: 10px">找不到你想要的界面</div>
        <div class="infoFont3" style="margin-top: 10px">错误代码:404</div>
        <div class="infoFont3" style="margin-top: 10px;font-weight: 300">下面是一些有用的链接</div>
        <div style="margin-top: 5px">
          <router-link to="/" class="linkFont">首页</router-link>
        </div>
        <div style="margin-top: 5px">
          <router-link to="/type" class="linkFont">分类</router-link>
        </div>
        <div style="margin-top: 5px">
          <router-link to="/tag" class="linkFont">标签</router-link>
        </div>
        <div style="margin-top: 5px">
          <router-link to="/archiver" class="linkFont">归档</router-link>
        </div>
        <div style="margin-top: 5px">
          <router-link to="/friendLink" class="linkFont">友链</router-link>
        </div>
      </el-col>
      <el-col :sm="{span:9,offset:2}">
        <img src="../assets/image/404.gif">
      </el-col>
    </el-row>
  </div>
</template>
<script>
  export default {
    name: 404
  }
</script>
<style scoped>
.infoFont1 {
  color: #484848;
  font-size: 100px;
  font-weight: 700;
}
.infoFont2 {
  color: #484848;
  font-size: 40px;
  font-weight: 300;
}
.infoFont3 {
  color: #767676;
  font-size: 15px;
  font-weight: 700;
}
.linkFont {
  font-size: 15px;
  color: #3fb8ff;
  text-decoration: none;
}
</style>